<template>
  <div class="app">
    大标题  <button @click="fn">编辑</button><br/>
    <input ref="inp" v-if="isShow" type="text"> <button>确认</button>
  </div>
</template>

<script>

export default {
  data() {
    return {
      isShow: false,
    }
  },
  components: {
   
  },
  mounted() {
    
  },
  methods: {
    fn() {
      this.isShow = true
      // 当dom更新之后会执行$nextTick里面的回调函数
      // this.$nextTick(() => {
      //   this.$refs.inp.focus()
      // })
      setTimeout(() => {
        this.$refs.inp.focus()
      },0)
      
    }
  }
}
</script>

<style>
</style>